<!DOCTYPE html>
<html lang="cn" xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{baseui/head :: head}">
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <meta name="description" content="动检通智慧云平台"/>
    <meta name="author" content="牧中(上海)物联网科技有限公司"/>
    <link rel="shortcut icon" href="/webjars/images/favicon.png"/>
    <link rel="stylesheet" href="/webjars/js/layui/css/layui.css" media="all">
    <title>牧中畜牧业大数据智慧云平台V1.0</title>


</head>
<body>
<!--顶部一级导航-->
<th:block th:replace="baseui/topheader :: topheader(1)"/>//


<!--平台管理菜单-->
<div id="topnav" th:replace="djt/partial/topnav :: topnav(8)"></div>


<div id="cl-wrapper">
    <!--左边导航-->
    <th:block th:replace="djt/partial/low_left :: nav(42)"/>

    <div class="container-fluid" id="pcont">
        <!--<div class="page-head">-->
        <!--<h3>生产记录</h3>-->
        <!--</div>-->


        <div class="row">
            <div class="col-md-12">
                <div class="block-flat">
                    <div class="header"><h3>申请记录</h3></div>
                    <div class="content">
                        <div class="table-responsive">
                            <div id="datatable_wrapper" class="dataTables_wrapper form-inline dt-bootstrap no-footer">

                                <div class="row">

                                    <!-- search-->

                                    <div style="white-space: nowrap">
                                        <span style="margin-left: 50px">   区域:
                                           <select class="select2" style="max-width: 120px;" onchange="showfactory()" id="city">
                                               <option value="全部">所有区域</option>

                                               <span th:each="cityAreaDto :${cityAreaDtoList}">
                                                    <optgroup th:label="${cityAreaDto.city}">
                                                        <span th:each="region :${cityAreaDto.regions}">
                                                            <option th:value="${region}" th:text="${region}">南漳县</option>
                                                        </span>
                                                    </optgroup>
                                               </span>
                                           </select>
                                        </span>

                                        <span style="margin-left: 50px">   案由:
                                           <select class="select2" style="max-width: 100px;">
                                              <option value="-1">所有案由</option>
                                            </select>
                                        </span>

                                        <span style="margin-left: 50px">   来源:
                                            <select class="select2" style="max-width: 160px;">
                                                <option value='-1' selected>所有来源</option>
                                            </select>
                                        </span>

                                        <span style="margin-left: 50px">   案件类型:
                                            <select class="select2" style="max-width: 160px;">
                                                <option value='-1' selected>所有类型</option>
                                            </select>
                                        </span>

                                        <span style="margin-left: 50px">
                                                <button class="btn btn-primary" onclick="SearchBtn()">查询</button>
                                         </span>

                                        <span style="margin-right:50px;">
                                                <button th:if="${userProfile!=null}" class="btn btn-primary"  >增加养殖场</button>
                                         </span>
                                    </div>

                                    <div class="row">
                                        <div class="col-sm-12">

                                            <!-- Table -->
                                            <table id="jqGrid"></table>
                                            <div id="jqGridPager"></div>

                                        </div>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>


        </div>
    </div>

</div>

<script type="text/javascript" src="/webjars/js/jquery.js"></script>
<script type="text/javascript" src="/webjars/js/jquery.gritter/js/jquery.gritter.js"></script>

<script type="text/javascript" src="/webjars/js/jquery.nanoscroller/jquery.nanoscroller.js"></script>
<script type="text/javascript" src="/webjars/js/behaviour/general.js"></script>
<script src="/webjars/js/jquery.ui/jquery-ui.js" type="text/javascript"></script>

<script type="text/javascript" src="/webjars/js/jquery.nestable/jquery.nestable.js"></script>
<script type="text/javascript" src="/webjars/js/bootstrap.switch/bootstrap-switch.min.js"></script>
<script type="text/javascript" src="/webjars/js/bootstrap.datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
<script src="/webjars/js/jquery.select2/select2.min.js" type="text/javascript"></script>
<script src="/webjars/js/skycons/skycons.js" type="text/javascript"></script>
<script src="/webjars/js/bootstrap.slider/js/bootstrap-slider.js" type="text/javascript"></script>
<script type="text/javascript" src="/webjars/js/jquery.niftymodals/js/jquery.modalEffects.js"></script>
<script type="text/javascript" src="/webjars/js/bootstrap.summernote/dist/summernote.min.js"></script>


<script type="text/javascript" src="/webjars/js/jquery.magnific-popup/dist/jquery.magnific-popup.min.js"></script>


<script src="/webjars/js/behaviour/voice-commands.js"></script>
<script src="/webjars/js/bootstrap/dist/js/bootstrap.min.js"></script>

<script type="text/ecmascript" src="/webjars/jqgrid/js/i18n/grid.locale-cn.js"></script>
<script type="text/ecmascript" src="/webjars/jqgrid/js/jquery.jqGrid.min.js"></script>
<script src="/webjars/js/laydate/laydate.js"></script>
<script src="//vuejs.org/js/vue.min.js"></script>
<script src="https://cdn.bootcss.com/vue/2.2.2/vue.min.js"></script>
<script src="/webjars/js/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript">
    var PostDatas = {
        };

    //在文档加载后激活函数
    $(document).ready(function () {

        //初始化
        App.init();

        //grid 根据请求返回值,自动创建表格
        $("#jqGrid").jqGrid({
            url: '/djt/pollcelow/borrowRecord',
            postData: PostDatas,//请求参数 数组格式 此时是空值
            mtype: "GET",
            styleUI: 'Bootstrap',
            datatype: "json",
            autowidth: true,
            colModel: [
                {label: '序号', name: 'id', key: true, width: 100, align: 'center'},
                {label: '<span style="text-align: center">案由</span>', name: 'cause_action', width: 200, align: 'center'},
                {label: '<span style="text-align: center">申请人</span>', name: 'borrower', width: 100, align: 'center'},
                {label: '<span style="text-align: center">申请时间</span>', name: 'created_at', width: 150,formatter: ShowDate,  align: 'center'},
                {label: '<span style="text-align: center">状态</span>', name: 'status', width: 150,formatter: showStatus, align: 'center'},
                {label: '<span style="text-align: center">有效期</span>', name: 'borrow_end_date', width: 100,formatter: ShowDate,  align: 'center'},
                {label: '<span style="text-align: center">备注</span>', name: 'remark', width: 100, align: 'center'},

                /*
                {label: '<span style="text-align: center">操作</span>', width: 200, formatter: ShowOpertator, align: 'center'}
                */
            ],
            viewrecords: true,
            align: 'center',
            height: 350,
            rowNum: 20,
            pager: "#jqGridPager"
        });

    });
    //    时间格式化
    function ShowDate(cellvalue, options, rowObject) {

        var timestamp4 = new Date(cellvalue);
        var dt = timestamp4.toLocaleDateString().replace(/\//g, "-") + " " + timestamp4.toTimeString().substr(0, 8);
        return dt;
    }

    // 0为未审批; 1为通过借阅; -1为未通过借阅
    function showStatus(status, options, rowObject) {
        switch (Number(status)){
            case 0:
                return "未审批";
                break;
            case 1:
                return "通过借阅";
                break;
            case -1:
                return "未通过借阅";
                break;
        }
    }




</script>


</body>
</html>
